<template>
  <el-tabs v-model="activeName">
    <el-tab-pane label="User" name="first">User</el-tab-pane>
    <el-tab-pane label="Config" name="second">Config</el-tab-pane>
    <el-tab-pane label="Role" name="third">Role</el-tab-pane>
    <el-tab-pane label="Task" name="fourth">Task</el-tab-pane>
  </el-tabs>
</template>

<script lang="ts" setup>
import { ref } from 'vue'

interface TapItem {
  label: string
  name: string
}
interface IProp {
  tabList: TapItem[]
}

const props = withDefaults(defineProps<IProp>(), {
  tabList: () => []
})

const activeName = ref<string>(props.tabList[0].name)
</script>
<style lang="scss" scoped></style>
